<template>
    <div>


        <el-row :gutter="20" style="margin-top:20px;">
            <el-col :span='6'>
                <a href="/download/doc/教育部科研实验室安全检查系统使用手册（完整版）.docx" class="doc"> <i class="iconfont icon-huanzhebaogao" style="font-size:20px"></i> 使用手册-完整版</a>
            </el-col>
             <el-col :span='6'>
                <a href="/download/doc/教育部科研实验室安全检查系统使用手册（高校版）.docx" class="doc"> <i class="iconfont icon-huanzhebaogao" style="font-size:20px"></i> 使用手册-高校版</a>
            </el-col>
             <el-col :span='6'>
                <a href="/download/doc/教育部科研实验室安全检查系统使用手册（专家版）.docx" class="doc"> <i class="iconfont icon-huanzhebaogao" style="font-size:20px"></i> 使用手册-专家版</a>
            </el-col>
             <el-col :span='6'>
                <a href="/download/doc/教育部科研实验室安全检查系统使用手册（教育主管部门版）.docx" class="doc"> <i class="iconfont icon-huanzhebaogao" style="font-size:20px"></i> 使用手册-教育主管部门版</a>
            </el-col>
        </el-row>
        <el-divider></el-divider>


        <div class="news">
            <h3>资讯与通知</h3>
            <ul>
                <li v-for="item in news">

                    <p class="title" style="padding-right:20px;">
                        <a :href="item.url" v-if="item.url" target="_blank">{{item.title}}</a>
                        <span v-else>{{item.title}}</span>
                        <!--<a :href="item.fileDocs[0].path"  v-else target="_blank" >{{item.title}}</span></a>-->
                    </p>
                    <p class="date">{{item.gmt_created.substr(0,10)}}</p>
                    <i class="icon" v-if="item.fileDocs.length>0">
                        <a :href="base_url + item.fileDocs[0].path" target="_blank">
                            <i class="iconfont icon-huanzhebaogao" style="font-size:20px"></i>
                        </a>
                    </i>
                </li>
            </ul>
        </div>

    </div>
</template>
<script>
        import {requestLogin, verifyCode, newsList , unitSingUp} from '../api/api';

    export default {
        data(){
            return {
                base_url: "",
                news: [],
            }
        },
        created: function () {
            this.getNewsList()
         
        },
        methods:{
            getBaseURL() {
                auth_api.getResourceUrl().then(res => {
                    this.base_url = res.data.datas
                })
            },
            getNewsList() {
                let params = {
                    "page_size": 6, "page_current": 1,
                    condition: {"show_status": 1}
                }
                newsList(params).then((res) => {

                    this.news = JSON.parse(res.datas).items
                    if(this.news.length > 5)
                        this.news = this.news
                })
            },
        }
    
    }
</script>

<style lang="scss" scoped>
    .page-container {
        font-size: 20px;
        text-align: center;
        color: rgb(192, 204, 218);
    }
    .el-col {
        text-align:center;
    }
    .news {
           
                width: 1000px;
                margin: 0 auto;
                color: #666;
                ul {
                    padding: 0;
                    margin: 10px 0
                }
            
                h3 {
                    margin: 0;
                    font-weight: 100;
                    font-size: 18px
                }
                li {
                    list-style: none;
                    position: relative;
                    margin: 0;
                    padding: 5px 0;
                    border-bottom: 1px solid #ddd
                }
                p {
                    margin: 5px 0
                }
                .title {
                    font-size: 16px;
                }
                .date {
                    font-size: 14px;
                }
                .icon {
                    position: absolute;
                    right: 0;
                    top: 20px;
                }
            }
</style>